// Slide transition
.sleek-mobile-transition-flip-wrapper {
	position: relative;
	@include perspective(1000 !important);
	@include transform-style(preserve-3d !important);
}

.sleek-mobile-transition-flip {
	background: $wrapper-bg !important;
	@include transition(all $transition-duration ease-in-out !important);
	@include backface-visibility(hidden !important);
}

.sleek-mobile-transition-flip-in-start {
	opacity: 0 !important;
	z-index: 1 !important;
	@include transform(rotateY(180deg) !important);
}

.sleek-mobile-transition-flip-in-end {
	opacity: 1 !important;
	z-index: 2 !important;
	@include transform(rotateY(0) !important);
}

.sleek-mobile-transition-flip-out-start {
	opacity: 1 !important;
	z-index: 2 !important;
	@include transform(rotateY(0) !important);
}

.sleek-mobile-transition-flip-out-end {
	opacity: 0 !important;
	z-index: 1 !important;
	@include transform(rotateY(180deg) !important);
}

// Reverse
.sleek-mobile-transition-flip-in-reverse-start {
	opacity: 0 !important;
	z-index: 1 !important;
	@include transform(rotateY(-180deg) !important);
}

.sleek-mobile-transition-flip-in-reverse-end {
	opacity: 1 !important;
	z-index: 2 !important;
	@include transform(rotateY(0) !important);
}

.sleek-mobile-transition-flip-out-reverse-start {
	opacity: 1 !important;
	z-index: 2 !important;
	@include transform(rotateY(0) !important);
}

.sleek-mobile-transition-flip-out-reverse-end {
	opacity: 0 !important;
	z-index: 1 !important;
	@include transform(rotateY(-180deg) !important);
}
